import { useCallback, useState } from "react";

export const useController = () => app => {
  
  const [state, setState] = useState("loading");

  const run = useCallback((shouldRequest = true) => {
    app.run();
  }, []);

  return {
    middlewares: async function controller(ctx, next) {
      ctx.state = state;
      ctx.setState = setState;
      console.group(
        "%c 🍆 useController before: ",
        "font-size:20px;background-color: #4b4b4b;color:#fff;",
        ctx
      );

      await next();

      console.log(
        "%c 🍆 useController after: ",
        "font-size:20px;background-color: #4b4b4b;color:#fff;",
        ctx
      );
      console.groupEnd();
    },
    props: ctx => {
      return { state, run };
    }
  };
};
